import type { Directive, DirectiveBinding } from 'vue'
import { useAuthStore } from '@/stores/auth'

export const permission: Directive = {
  mounted(el: HTMLElement, binding: DirectiveBinding) {
    const { value } = binding
    const authStore = useAuthStore()
    
    if (!authStore.checkPermission(value)) {
      el.parentNode?.removeChild(el)
    }
  }
}

// 注册指令
export function setupPermission(app: App) {
  app.directive('permission', permission)
}

// 使用示例:
// v-permission="'user:add'"  // 单个权限
// v-permission.some="['user:add', 'user:edit']"  // 任一权限
// v-permission="['user:add', 'user:edit']"  // 所有权限 